<template>
	<view class="content">
		<div class="bg"></div>
		
		<view class="pay">
			<view>付款给{{name}}</view>
			<view class="clo-999 f24 mt10">付款金额：</view>
			<view class="line">
				<text>¥</text>
				<view style="padding: 0 10px;">{{money}}</view>
				
			</view>
			<view class="comment">
				
				<view class="r">
					<text>{{new_money}}</text>
				</view>
			</view>
		</view>
		<!-- 键盘 -->
		<view class="keyboard" v-if="is_effective">
			<view class="left">
				<!-- <view v-for="item of 9" @tap="tapMoney(item)">{{item}}</view> -->
				<view @tap="tapMoney(1)">1</view>
				<view @tap="tapMoney(2)">2</view>
				<view @tap="tapMoney(3)">3</view>
				<view @tap="tapMoney(4)">4</view>
				<view @tap="tapMoney(5)">5</view>
				<view @tap="tapMoney(6)">6</view>
				<view @tap="tapMoney(7)">7</view>
				<view @tap="tapMoney(8)">8</view>
				<view @tap="tapMoney(9)">9</view>
				<view @tap="rest()">重输</view>
				<view @tap="tapMoney(0)">0</view>
				<view @tap="tapMoney('.')">.</view>
			</view>
			<view class="right">
				<view class="del" @tap="del()">
					<image src="https://shop.shenghuo727.com/public/static/img/del.png" mode="widthFix"></image>
				</view>
				<view class="sure" @tap="go()">确认付款</view>
			</view>
		</view>
		<!-- <ns-login ref="login"></ns-login> -->
	</view>
	
</template>

<script>
import { provide } from 'vue';
import {aliH5Login,payShopInfo,payOrder,shopAd} from '@/utils/api.js'

	export default {
		data() {
			return {
				name:"",
				memberInfo: {},
				money:'',
				cid: '',
				shop_id: '',
				user_id: 0,
				new_money: '',
				ad_text:'',
				ad_id:'',
				new_num: 0,
				money_real: 0,
				is_login: false,
				provider:'',
				openId: '',
				is_pay: true,
				is_effective: true,
				pay_discount:100
			}
		},
		onLoad(e) {
			if(e && e.shop_id){
				this.shop_id = e.shop_id;
			}else{
				uni.showToast({
					title:'无效二维码',
					icon:'none'
				})
				
				return false;
			}
			
			if(e.user_id){
				this.user_id=e.user_id
				uni.setStorageSync('user_id',e.user_id);
			}else{
				this.user_id=uni.getStorageSync('user_id')
			}
			
			// this.member_id = e.uid;
			// uni.setStorageSync('memberid',e.uid);
			
			// var user_id = uni.getStorageSync('user_id');
			// if(member){
			// 	this.member_id = member;
			// }
			
			let ua = window.navigator.userAgent.toLowerCase();
			//判断是不是微信
			if (ua.match(/MicroMessenger/i) == "micromessenger") {
			　　// 微信
				if(this.user_id == 0){
					//获取用户微信授权信息
					window.location.href = "https://life727newapi.shenghuo727.com/index.h5/wxlogin?shop_id="+this.shop_id;
				}
				this.apptype = "wechat";
			}else if (ua.match(/AlipayClient/i) == "alipayclient") {//判断是不是支付宝
			　　//支付宝
				ap.getAuthCode ({appId :'2021003192639205',scopes : [ 'auth_base' ]},
				function ( res ){
					// alert(res.authCode);
					aliH5Login({'code':res.authCode}).then(res=>{
						let data=res.data
						this.user_id=data.user_id
						uni.showToast({
							title:'用户id是：'+data.user_id
						})
						uni.setStorageSync('user_id',data.user_id);
					})
				});
				this.apptype = "alipay";
			}else{
				// uni.showToast({
				// 	title:'请使用微信或支付宝扫码',
				// 	icon:'none'
				// })
				
				// return false;
			}
			
			payShopInfo({'shop_id':this.shop_id}).then(res=>{
				let data=res.data
				this.name=data.title
				this.pay_discount=data.pay_discount
			})
			
			shopAd({'shopid':this.shop_id}).then(res=>{
				let data=res.data
				// console.log(data.ad_text)
				this.ad_text=data.ad_text
			})
			
		},
		onShow(){
			// this.money=''
			// this.min_money = '';
			// this.new_money = '';
			uni.hideLoading()
		},
		methods: {
			tapMoney(e){
				var that=this
				var d=0
				var h=0
				for(var i=0;i<that.money.length;i++){
					if(that.money[i]=='.'){
						if (e=='.'){
							if(that.money.length)
							d+=1	
						}
						var h=that.money.length-i
					}
				}
				if(that.money.length==0&&e=='.'){
					this.money='0.'
				}
				//过滤输入的00
				if(that.money[0]==0){
				    if(e==0&&h<1){
						that.money=''
				    }else if(e!=0 ){
						if(e=='.'){
							that.money='0'
						}
				    } 
				}

				if(d<1&&h<3){
					this.money+=e
				}
				this.money_real = this.money;
				this.sum_money();
			},
			del(){
				var that=this
				that.money=that.money.slice(0,that.money.length-1);
				that.money_real = that.money;
				this.sum_money();
			},
			rest(){
				this.money='';
				this.money_real = 0;
				// this.min_money = "";
				this.new_money = "";
			},
			//重新计算支付金额
			sum_money(){
				this.new_money=(this.money*this.pay_discount/100).toFixed(2)
			},
			go(){
				if(this.money == 0){
					uni.showToast({
						title: "支付金额不能为0",
						icon: 'none',
						duration: 2000
					});
					this.is_pay = true;
					return false;
				}
				var that=this;
				//这里是复制
				uni.setClipboardData({
					data:that.ad_text,
					complete() {
						// console.log('这里错了'+that.dou_text)
						uni.showLoading({
							title: '请稍后'
						})
						let data={
							'shop_id':that.shop_id,
							'money':that.money,
							'user_id':that.user_id,
							'provider':that.provider
						}
						payOrder(data).then(res=>{
							let data=res.data
						})
						return;

						//模拟支付成功
						uni.request({
							url:that.base_url+'index.pay/pay',
							data:{cid:that.cid,m_id:that.shop_id,money:that.money,member_id:that.member_id,ad_id:that.ad_id,openId:that.openId,provider:that.provider},
							success(res) {
								console.log(res);
								if(res.data.code==1){
									//这里是支付宝
									if(that.provider=='alipay'){
										that.myPay(res.data.data).then(function(res){
											that.is_pay = true;
											if(res[1] && res[1].resultCode && res[1].resultCode != '9000'){
												that.payFail("支付不成功")
											}else if(res[0] && res[0].errMsg && res[0].errMsg == 'requestPayment:fail cancel'){
												that.payFail("支付不成功")
											}else{
												that.paySuccess(res.data);
											}
										}).catch(function(err){
											that.payFail(err)
										})
									}else{
										var res_data = res.data.data;
										if(res_data.subCode === '0'){
											var businessData = res_data.businessData.data;
											Object.assign(businessData, {isFastPay: '01'});// 需要省略点击支付动作才传该参数
											uni.openEmbeddedMiniProgram({
												appId: 'wx05e71f6f41f6b9b4',
												path: 'pages/index/index', //打开的页面路径
												// envVersion: 'trial', //develop：开发版；trial：体验版；release：正式版
												extraData: { 
													//解密后的数据，Object类型。直接将接口返回的businessData转换成Object后传入即可
													businessData: {
														"data": businessData,
														"resultCode": 0,
														"message": "下单成功",
														"suffixCode": 0,
														"rpcError": false
													}, 
												},
												success(res) {
													console.log(res);
													// alert(res);
													that.wxPaySuccess(res);
												},
												fail(){
													that.payFail("支付不成功")
												}
											});
										}else{
											that.payFail("支付不成功")
										}
									}
								}
							}
						});
					}
				})
				// this.gopays();
			},
			gopays(){

				console.log(2222,this.is_pay);
			},
			myPay(payData){
				//这里是微信
				if(this.provider=='weixin'){
					return uni.requestPayment({
						"provider": "wxpay", 
						timeStamp:payData.timeStamp,
						nonceStr:payData.nonceStr,
						package:payData.package,
						signType:payData.signType,
						paySign:payData.paySign,
						})	
				}

				if(this.provider=='alipay'){
					//这里是支付宝payData.tradeNo是字符串，为统一下单接口返回的tradeNo
					return uni.requestPayment({
						"provider": "alipay", 
						orderInfo:payData.tradeNo,
					})	
				}
			},
			//微信支付成功操作
			wxPaySuccess(data){
				uni.hideLoading();
				var that = this;
				uni.navigateBackMiniProgram({
					extraData: {
						payResult: 'success',//仅当支付成功并点击“完成”按钮情况下为success,其余情况为fail或空
						memberInfolength: Object.keys(that.memberInfo).length,
						money: that.money,
					},
					success(){

					},
					fail(err){
						console.log(err);
						that.payFail("支付不成功")
					}
				})
			},
			//支付成功操作
			paySuccess(data){
				uni.hideLoading()
				// if(Object.keys(this.memberInfo).length == 0){
				// 	uni.reLaunch({
				// 		url:'/pages/pay/success?money='+this.money
				// 	})

				// 	return false;
				// }
			},
			//支付失败操作
			payFail(res){
				console.log(res)
				this.money=''
				this.new_money = '';
				uni.hideLoading()
			}
		}
	}
</script>

<style>
	page {background: #f9f9f9; height: 100vh; overflow: hidden;}
	view{line-height: 1.3;}
	.bg {position: absolute; top: 0; left: 0; background: #09bf62; height: 180rpx; width: 100%; border-radius: 0 0 30rpx 30rpx; z-index: 0;}
	
	.pay {margin-top: 20rpx;background: #fff;padding: 40rpx 25rpx; margin: 50rpx 30rpx; border-radius: 25rpx; position: relative; z-index: 9;}
	.comment {display: flex;align-items: flex-start;justify-content: space-between;}
	.comment .l {color: #999;font-size: 20rpx;}
	.comment .r {color: #ff0000; font-size: 20rpx;}
	.comment .r text {display: block;}
	.line { height: 50rpx; line-height: 50rpx; padding: 15rpx 0; color: #09bf62; border-bottom: 1px solid #eee;display: flex; justify-content: space-between;align-items: center;margin-bottom: 20rpx;}
	.line input{font-size: 30rpx;}
	.line view {text-align: left; width: 100%; font-size: 50rpx;}
	.line text {font-size: 34rpx; padding-top: 10rpx;}
	.keyboard view {text-align: center;}
	.keyboard {position: fixed; bottom: 0;left: 0;display: flex;width: 96%;padding: 0 2%; justify-content: space-between;background: #f8f8f8;padding-top: 20rpx;}
	.keyboard .left view,.keyboard .right view{background: #fff;border-radius: 15rpx; color: #222;}
	.keyboard .left{width: 73%;display: flex;flex-wrap: wrap;justify-content: space-between;}
	.keyboard .left view {width: 32%;height: 100rpx;line-height: 100rpx;margin-bottom: 10rpx;font-size: 36rpx;}
	.keyboard .right {width: 25%;}

	.keyboard .right .del {margin: 0;padding: 0;height: 78rpx;line-height: 78rpx; display: flex; align-items: center;justify-content: center;}
	.keyboard .right image{width: 24%;margin-bottom: 0;}
	.keyboard .right view.sure {background:#09bf62 ;color: #fff;writing-mode: tb-rl;width: 100%;text-align: center;display:flex;flex-direction:column;justify-content:center;padding: 40rpx 0;margin-top: 10rpx;letter-spacing: 12rpx; height: 340rpx;box-sizing: border-box;}
</style>